import React, { useState, useEffect, useRef } from 'react';
import '../../assets/sass/home_page/Swiper_one/Swiper_one.scss'
import Video from './Swiper_two'
const Child = (props: any) => {
  const [counter, setCounter] = useState([]);
  const refs = useRef<HTMLDivElement>(null)
  useEffect(() => {
    setCounter(props.namesend)
    const demos = refs.current
    console.log(demos, 'demos')
      demos.onscroll = () => {
        console.log(demos.scrollLeft)
      }
  }, [props.namesend, refs])
  return (
    <div className="box1" ref={refs}>
      <div className="box2" >
        {counter && counter.map((item: any, index: any) => {
          return (
            <>
              <div key={index} className={item.clasname}>
                <div className={item.clasnames && item.clasnames}>
                  <div className={item.clasnamese && item.clasnamese}>
                    {item.clasnamese && '查看更多'}
                  </div>

                </div>
                <img src={item.path && item.path} alt="" />
                {item.paths && (<Video lists={item.paths}></Video>)}
                {item.h5 && (<div className="dingwei1">
                  <h5>星光之夜极简时尚商务科技活动邀请函</h5>
                </div>)}
              </div>
            </>
          )
        })}
      </div>
    </div>
  )
}
export default Child;